<!doctype html> <!--
paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!-- Consider adding a manifest.appcache: h5bp.com/d/Offline -->
<!--[if gt IE 8]><!-->
<html class="no-js" lang="en">
	<!--<![endif]-->
	<head>
		<meta charset="utf-8">
		<!-- DNS prefetch -->
		<link rel=dns-prefetch href="//fonts.googleapis.com">
		<!-- Use the .htaccess and remove these lines to avoid edge case issues.
		More info: h5bp.com/b/378 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		
		<title>Lists :: Peach &ndash; Clean &amp; Smooth Admin Template</title>
		<meta name="description" content="">
		<meta name="author" content="">
		
		<!-- Mobile viewport optimized: j.mp/bplateviewport -->
		<meta name="viewport" content="width=device-width,initial-scale=1">
		
		<!-- Place favicon.ico and apple-touch-icon.png in the root directory:
		mathiasbynens.be/notes/touch-icons -->
		
		<!-- CSS -->
		<link rel="stylesheet" href="css/960gs/fluid.css"> <!-- 960.gs Grid System -->
		<!-- The HTML5-Boilerplate CSS styling -->
		<link rel="stylesheet" href="css/h5bp/normalize.css"> <!-- RECOMMENDED: H5BP reset styles -->
		<link rel="stylesheet" href="css/h5bp/non-semantic.helper.classes.css"> <!-- RECOMMENDED: H5BP helpers (e.g. .clear or .hidden) -->
		<link rel="stylesheet" href="css/h5bp/print.styles.css"> <!-- OPTIONAL: H5BP print styles -->
		<!-- The main styling -->
		<link rel="stylesheet" href="css/sprites.css"> <!-- STRONGLY RECOMMENDED: Basic sprites (e.g. buttons, jGrowl) -->
		<link rel="stylesheet" href="css/header.css"> <!-- REQUIRED: Header styling -->
		<link rel="stylesheet" href="css/navigation.css"> <!-- REQUIRED: Navigation styling -->
		<link rel="stylesheet" href="css/content.css"> <!-- REQUIRED: Content styling -->
		<link rel="stylesheet" href="css/footer.css"> <!-- REQUIRED: Footer styling -->
		<link rel="stylesheet" href="css/typographics.css"> <!-- REQUIRED: Typographics -->
		<link rel="stylesheet" href="css/ie.fixes.css"> <!-- OPTIONAL: Fixes for IE7 -->
		<!-- Sprite styling -->
		<link rel="stylesheet" href="css/sprite.lists.css"> <!-- SPRITE: Lists styling -->
		<link rel="stylesheet" href="css/external/jquery-ui-1.8.16.custom.css"> <!-- REQUIRED: jQuery UI -->
		<link rel="stylesheet" href="css/icons.css"> <!-- OPTIONAL: List icons -->
		
		<!-- More ideas for your <head> here: h5bp.com/d/head-Tips -->
		
		<!-- All JavaScript at the bottom, except this Modernizr build incl. Respond.js
		Respond is a polyfill for min/max-width media queries. Modernizr enables HTML5
		elements & feature detects;
		for optimal performance, create your own custom Modernizr build:
		www.modernizr.com/download/ -->
		<script src="js/libs/modernizr-2.0.6.min.js"></script>
	</head>
	
	<body>
		
		<!-- Begin of #height-wrapper -->
		<div id="height-wrapper">
			<!-- Begin of header -->
			<header>
				<!-- Begin of the header toolbar -->
				<div id="header_toolbar">
					<div class="container_12">
						<h1 class="grid_8">Peach &ndash; Clean &amp; Smooth Admin Template</h1>
						<!-- Start of right part -->
						<div class="grid_4">
							<!-- A small toolbar button -->
							<div class="toolbar_small">
								<div class="toolbutton">
									<span>3</span>
									<img src="img/icons/16x16/mail.png" width="16" height="16" alt="mail" >
								</div>
								<div class="toolbox" >
									<span class="arrow"></span>
									<h3>Your Messages</h3>
									<ul class="mail">
										<li>
											<a href="#"> <strong>10:15</strong>Need your Help!
											<small>
												From: John
											</small> </a>
										</li>
										<li>
											<a href="#"> <strong>9:55</strong>New comment on you theme
											<small>
												From: themeforest
											</small></a>
										</li>
										<li>
											<a href="#"> <strong>Yest.</strong>Successfull backup
											<small>
												From: System
											</small></a>
										</li>
										<li class="read">
											<a href="#"> <strong>2 days</strong>Bug report
											<small>
												From: Jane
											</small></a>
										</li>
									</ul>
									<a class="inbox" href="#">Go to inbox &raquo;</a>
								</div>
							</div> <!-- End of small toolbar button -->
							
							<!-- A large toolbar button -->
							<div class="toolbar_large">
								<div class="toolbutton">
									<div class="toolicon">
										<img src="img/icons/16x16/user.png" width="16" height="16" alt="user" >
									</div>
									<div class="toolmenu">
										<div class="toolcaption">
											<span>Administrator</span>
										</div>
										<!-- Start of menu -->
										<div class="dropdown">
											<ul>
												<li>
													<a href="#">Settings</a>
												</li>
												<li>
													<a href="#">Logout</a>
												</li>
											</ul>
										</div> <!-- End of menu -->
									</div>
								</div>
							</div> <!-- End of large toolbar button -->
						</div>
						<!-- End of right part -->
					</div>
				</div>
				<!-- End of the header toolbar -->
				
				<!-- Start of the main header bar -->
				<nav id="header_main">
					<div class="container_12">
						<!-- Start of the main navigation -->
						<ul id="nav_main">
							<li>
								<a href="#">
								<img src="img/icons/25x25/dark/computer-imac.png" width=25 height=25 alt="">
								Dashboard</a>
								<ul>
									<li>
										<a href="dashboard.html">Dashboard</a>
									</li>
									<li>
										<a href="404.html">404</a>
									</li>
									<li>
										<a href="login.html">Login</a>
									</li>
								</ul>
							</li>
							<li class="current">
								<a href="#">
								<img src="img/icons/25x25/dark/blocks---images.png" width=25 height=25 alt="">
								Elements</a>
								<ul>
									<li>
										<a href="forms.html">Forms</a>
									</li>
									<li>
										<a href="gallery.html">Gallery</a>
									</li>
									<li class="current">
										<a href="lists.html">Lists</a>
									</li>
									<li>
										<a href="tables.html">Tables</a>
									</li>
									<li>
										<a href="tabs.html">Tabs</a>
									</li>
									<li class="last-child">
										<a href="wizard.html">Wizard</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">
								<img src="img/icons/25x25/dark/user-comment.png" width=25 height=25 alt="">
								User Information</a>
								<ul>
									<li>
										<a href="alert_boxes.html">Alert Boxes</a>
									</li>
									<li>
										<a href="messages.html">Messages (Fallr)</a>
									</li>
									<li>
										<a href="notifications.html">Notifications</a>
									</li>
								</ul>
							</li>
							<li>
								<a href="#">
								<img src="img/icons/25x25/dark/robot.png" width=25 height=25 alt="">
								Plugins</a>
								<ul>
									<li>
										<a href="charts.html">Charts</a>
									</li>
									<li>
										<a href="calendar.html">Calendar</a>
									</li>
									<li>
										<a href="explorer.html">Explorer</a>
									</li>
									<li>
										<a href="editor.html">Rich Text Editor</a>
									</li>
									<li>
										<a href="tooltips.html">Tooltips</a>
									</li>
								</ul>
							</li>
						</ul>
						<!-- End of the main navigation -->
					</div>
				</nav>
				<div id="nav_sub"></div>
			</header>
			
			<!-- Start of the content -->
			<div role="main" class="container_12" id="content-wrapper">
				
				<!-- Start of the main content -->
				<div id="main_content">
				
					<h2 class="grid_12">Lists</h2>
					<div class="clean"></div>
					
					<div class="grid_8">
						<div id="shortcuts-steps" class="box tabbed">
							<div class="header">
								<h3>Shortcuts & Steps</h3>
								<ul>
									<li>
										<a href="#shortcuts">Shortcuts</a>
									</li>
									<li>
										<a href="#steps">Steps</a>
									</li>
								</ul>
							</div>
							
							<div class="content">
								<ul id="shortcuts" class="shortcuts tab-content">
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/user.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Dashboard</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/chart-3.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Statistics</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/settings.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Settings</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/phone-hook.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Phone Book</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/mail-2.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Mails</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/money-2.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Finances</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/pencil.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>Articles</strong> <span>Your
											description here.</span> </a>
									</li>
									<li>
										<div class="shortcut-icon">
											<img src="img/icons/25x25/blue/linux.png" width="25" height="25">
											<div class="divider"></div>
										</div>
										<a class="shortcut-description" href="#"> <strong>System</strong> <span>Your
											description here.</span> </a>
									</li>
								</ul> <!-- End of #shortcuts -->
								
								<div id="steps" class="tab-content">
									<div class="step">
											<span>1</span>
											<div class="circle"></div>
											<a href="#"> <strong>Check out the dashboard</strong>
											<small>
													You'll find a sneak preview<br>
													of the theme's elements.
											</small> </a>
									</div>
									<div class="step">
											<span>2</span>
											<div class="circle"></div>
											<a href="#"> <strong>Check out the other pages</strong>
											<small>
													There is a lot to discover.
													<br>
													Honestly!
											</small> </a>
									</div>
									<div class="step">
											<span>3</span>
											<div class="circle"></div>
											<a href="#"> <strong>Fill your Profile</strong>
											<small>
													Don't forget to fill
													<br>
													your profile.
											</small> </a>
									</div>
								</div> <!-- End of #steps -->
							</div> <!-- End of .content -->
						</div> <!-- End of .box -->
					</div> <!-- End of .grid_8 -->
					
					<div class="grid_4">
						<div id="blocks" class="box tabbed">
							<div class="header">
								<h3>Block Lists</h3>
								<ul>
									<li>
										<a href="#block-list">Without Icons</a>
									</li>
									<li>
										<a href="#block-list-icons">With Icons</a>
									</li>
								</ul>
							</div>
							<div class="content">
								<ul id="block-list" class="block-list tab-content">
									<li>
										<strong>Without icons</strong>
									</li>
									<li>
										Lorem ipsum
									</li>
									<li>
										Lorem ipsum
									</li>
									<li>
										Lorem ipsum
									</li>
									<li>
										Lorem ipsum
									</li>
								</ul>

								<ul id="block-list-icons" class="block-list with-icon tab-content">
									<li class="i-16-calendar">
										<strong>With icons</strong>
									</li>
									<li class="i-16-application">
										Lorem ipsum
									</li>
									<li class="i-16-balloon">
										Lorem ipsum
									</li>
									<li class="i-16-chart">
										Lorem ipsum
									</li>
									<li class="i-16-drive">
										Lorem ipsum
									</li>
								</ul>
							</div> <!-- End of .content -->
						</div> <!-- End of .box -->
					</div> <!-- End of .grid_4 -->
					<div class="clear"></div>
					
					<div class="grid_7">
						<div class="box tabbed">
							<div class="header">
								<h3>Special Lists</h3>
								<ul>
									<li>
										<a href="#slider-wrapper">Contact List</a>
									</li>
									<li>
										<a href="#accordion">Accordion</a>
									</li>
									<li>
										<a href="#activity-stream">Activity Stream</a>
									</li>
								</ul>
							</div>
							<div class="content">
								<div id="slider-wrapper" class="tab-content">
									<p>
										This is a very impressive method for displaying a lot of data.
									</p>
									<p>
										You are not limited, to use the initial letters. Instead of using the letters, you can use complete words or anything else.
									</p>
									<div id="slider" class="slider">
										<div class="slider-content">
											<ul>
												<li id="a" class="selected">
													<a class="title" name="a">A</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Adam</a>
														</li>
														<li>
															<a href="javascript:void(0);">Alex</a>
														</li>
														<li>
															<a href="javascript:void(0);">Ali</a>
														</li>
														<li>
															<a href="javascript:void(0);">Apple</a>
														</li>
														<li>
															<a href="javascript:void(0);">Arthur</a>
														</li>
														<li>
															<a href="javascript:void(0);">Ashley</a>
														</li>
													</ul>
												</li>
												<li id="b">
													<a class="title" name="b">B</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="c">
													<a class="title" name="c">c</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="d">
													<a class="title" name="d">d</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="e">
													<a class="title" name="e">E</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="f">
													<a class="title" name="f">f</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="g">
													<a class="title" name="g">g</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="h">
													<a class="title" name="h">h</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="i">
													<a class="title" name="i">i</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="j">
													<a class="title" name="j">j</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="k">
													<a class="title" name="k">k</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="l">
													<a class="title" name="l">l</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="m">
													<a class="title" name="m">m</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="n">
													<a class="title" name="n">n</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="o">
													<a class="title" name="o">o</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="p">
													<a class="title" name="p">p</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="q">
													<a class="title" name="q">q</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="r">
													<a class="title" name="r">r</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="s">
													<a class="title" name="s">s</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="t">
													<a class="title" name="t">t</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="u">
													<a class="title" name="u">u</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="v">
													<a class="title" name="v">v</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Barry</a>
														</li>
														<li>
															<a href="javascript:void(0);">Becky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Biff</a>
														</li>
														<li>
															<a href="javascript:void(0);">Billy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bozarking</a>
														</li>
														<li>
															<a href="javascript:void(0);">Bryan</a>
														</li>
													</ul>
												</li>
												<li id="w">
													<a class="title" name="w">w</a>
													<ul>
														<li>
															<a href="javascript:void(0);">Calista</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cathy</a>
														</li>
														<li>
															<a href="javascript:void(0);">Chris</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cinderella</a>
														</li>
														<li>
															<a href="javascript:void(0);">Corky</a>
														</li>
														<li>
															<a href="javascript:void(0);">Cypher</a>
														</li>
													</ul>
												</li>
												<li id="x">
													<a class="title" name="x">x</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="y">
													<a class="title" name="y">y</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
												<li id="z">
													<a class="title" name="z">z</a>
													<ul>
														<li>
															<a href="javascript:void(0);">damien</a>
														</li>
														<li>
															<a href="javascript:void(0);">danny</a>
														</li>
														<li>
															<a href="javascript:void(0);">denver</a>
														</li>
														<li>
															<a href="javascript:void(0);">devon</a>
														</li>
														<li>
															<a href="javascript:void(0);">doug</a>
														</li>
														<li>
															<a href="javascript:void(0);">dustin</a>
														</li>
													</ul>
												</li>
											</ul>
										</div>
									</div> <!-- end #slider -->
								</div> <!-- end #slider-wrapper -->
								
								<div id="accordion" class="tab-content">
									<h4><a href="#">Section 1</a></h4>
									<div>
										<p>
											Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
											ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
											amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
											odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
										</p>
									</div>
									<h4><a href="#">Section 2</a></h4>
									<div>
										<p>
											Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
											purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
											velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
											suscipit faucibus urna.
										</p>
									</div>
									<h4><a href="#">Section 3</a></h4>
									<div>
										<p>
											Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
											Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
											ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
											lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
										</p>
										<ul>
											<li>
												List item one
											</li>
											<li>
												List item two
											</li>
											<li>
												List item three
											</li>
										</ul>
									</div>
									<h4><a href="#">Section 4</a></h4>
									<div>
										<p>
											Cras dictum. Pellentesque habitant morbi tristique senectus et netus
											et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
											faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
											mauris vel est.
										</p>
										<p>
											Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
											Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
											inceptos himenaeos.
										</p>
									</div>
								</div> <!-- End of #accordion -->
								
								<div id="activity-stream" class="tab-content">
									<div class="activity">
										<div class="avatar">
											<img src="img/sprites/activity-stream/avatar.png" width="52" height="52">
										</div>
										<div class="description">
											<span></span>
											<a href="#">John Doe</a> added 2 new tasks.
											<small>
												<a href="">Contact host support</a>
											</small>
											<ul class="toolbar">
												<li>
													<a href="#" rel="tooltip-top" title="Go to activity">
													<img src="img/icons/packs/fugue/16x16/shadeless/pencil.png">
													</a>
												</li>
												<li>
													<a href="#" rel="tooltip-top" title="Send message">
													<img src="img/icons/packs/fugue/16x16/shadeless/mail-send.png">
													</a>
												</li>
												<li>
													<a href="#" rel="tooltip-top" title="Hide activity">
													<img src="img/icons/packs/fugue/16x16/shadeless/cross.png">
													</a>
												</li>
											</ul>
										</div>
									</div> <!-- End of .activity -->
									<div class="activity">
										<div class="avatar">
											<img src="img/sprites/activity-stream/avatar.png" width="52" height="52">
										</div>
										<div class="description">
											<span></span>
											<a href="#">John Doe</a> wrote you a message.
											<small>
												<a href="">Read message</a>
											</small>
											<ul class="toolbar">
												<li>
													<a href="#" rel="tooltip-top" title="Go to activity">
													<img src="img/icons/packs/fugue/16x16/shadeless/pencil.png">
													</a>
												</li>
												<li>
													<a href="#" rel="tooltip-top" title="Send message">
													<img src="img/icons/packs/fugue/16x16/shadeless/mail-send.png">
													</a>
												</li>
												<li>
													<a href="#" rel="tooltip-top" title="Hide activity">
													<img src="img/icons/packs/fugue/16x16/shadeless/cross.png">
													</a>
												</li>
											</ul>
										</div>
									</div> <!-- End of .activity -->
								</div> <!-- End of #activity-stream -->
							</div> <!-- End of .content -->
						</div> <!-- End of .box -->
					</div> <!-- End of .grid_7 -->
					
					<div class="grid_5">
						<div class="box">
							<div class="header">
								<img src="img/icons/16x16/list.png" alt="" width="16"
								height="16">
								<h3>Stats List</h3>
								<span></span>
							</div>
							<div class="content">
								<ul class="stats-list">
									<li>
										<a href="#">Total Visits <span>12132</span></a>
									</li>
									<li>
										<a href="#">Today Visits <span>875</span></a>
									</li>
									<li>
										<a href="#">Comments <span>312</span></a>
									</li>
									<li>
										<a href="#">Support Tickets <span>12</span></a>
									</li>
								</ul>
								<div class="clear"></div>
							</div>
							<div class="actions">
								<div class="actions-left"></div>
								<div class="actions-right">
									<a href="charts.html">
									<button>
										Go to stats &raquo;
									</button></a>
								</div>
								<div class="clear"></div>
							</div> <!-- End of .content -->
						</div> <!-- End of .box -->
					</div> <!-- End of .grid_5 -->
					
				</div> <!-- End of #main_content -->
				<div class="clear"></div>
				
			</div> <!-- End of #content-wrapper -->
			<div class="clear"></div>
			
		</div> <!-- End of #height-wrapper -->
		
		<!-- Start of footer-->
		<footer>
			<div class="container_12">
				Copyright &copy; 2011 YourCompany, all rights reserved.
				<div id="button_bar">
					<ul>
						<li>
							<span><a href="dashboard.html">Dashboard</a></span>
						</li>
						<li>
							<span><a href="#">Settings</a></span>
						</li>
					</ul>
				</div>
			</div>
		</footer><!-- End of footer-->
		
		
		<!-- JavaScript at the bottom for fast page loading -->
		<!-- Grab Google CDN's jQuery + jQueryUI, with a protocol relative URL; fall back to local -->

		<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
		<script>window.jQuery || document.write('<script src="js/libs/jquery-1.6.4.js"><\/script>')</script>
		<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
		<script>window.jQuery.ui || document.write('<script src="js/libs/jquery-ui-1.8.16.min.js"><\/script>')</script>
		
		<!-- scripts concatenated and minified via build script -->
		<script defer src="js/plugins.js"></script> <!-- REQUIRED: Different own jQuery plugnis -->
		<script defer src="js/mylibs/jquery.ba-resize.js"></script> <!-- RECOMMENDED when using sidebar: page resizing -->
		<script defer src="js/mylibs/jquery.easing.1.3.js"></script> <!-- RECOMMENDED: box animations -->
		<script defer src="js/mylibs/jquery.ui.touch-punch.js"></script> <!-- RECOMMENDED: touch compatibility -->
		<script defer src="js/mylibs/jquery.equalheights.js"></script>
		<script defer src="js/mylibs/slidernav.js"></script>
		<script defer src="js/mylibs/jquery.tipsy.js"></script>
		<script defer src="js/script.js"></script> <!-- REQUIRED: Generic scripts -->
		<!-- end scripts -->
		<script>
			$(window).load(function() {
				try {
					$('#slider').sliderNav();
					$('#accordion').accordion();
					$('.tabbed').each(function(){
						$(this).createTabs();
					});
				} catch (e) {
					window.setTimeout(function(){
						$('#slider').sliderNav();
						$('#accordion').accordion();
						$('.tabbed').each(function(){
							$(this).createTabs();
						});
					}, 100);
				}
			});

		</script>
		
		<!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to
		support IE 6.
		chromium.org/developers/how-tos/chrome-frame-getting-started -->
		<!--[if lt IE 7 ]>
		<script defer
		src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
		<script
		defer>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
		<![endif]-->
	</body>
</html>
